.container{width: 800px; height: 460px; margin: 0 auto; margin-top: -20px; border:0px solid #d0d0d0;}
.bg{width: auto; height: 20px; z-index: 99; position: absolute; left: 15px; bottom: 15px;}
.bg_in{width: 200px; height: 20px; position: relative;}
.bg_in li{width: 10px; height: 10px; line-height: 20px; border-radius: 20px; background: #ffffff; opacity: 0.5; text-align: center; color: #333333; float: left; margin-right: 10px; position: relative; z-index: 999;}
.bg_in #lp{position: absolute; left: 0px; top: 0; background: #ff3c00; opacity: 1; z-index: 998; animation: myfirstArr 27s infinite; -webkit-animation: myfirstArr 27s infinite; -moz-animation: myfirstArr 27s infinite; -o-animation: myfirstArr 27s infinite;}

.nav{width: 6400px; height: 460px; position: absolute; left: 0px; top: 0; z-index: 9; animation: myfirst 27s infinite; -webkit-animation: myfirst 27s infinite; -o-animation: myfirst 27s infinite; -moz-animation: myfirst 27s infinite;}
.nav li{float: left; width:800px; height:460px;text-decoration:none; list-style-type:none;}
@keyframes myfirst
{
    0%   {left: 0px;}
    4%   {left: 0px;}
    16%   {left: -800px;}
    28%   {left: -1600px;}
    40%   {left: -2400px;}
    52%   {left: -3200px;}
    64%   {left: -4000px;}
    76%   {left: -4800px;}
    88%   {left: -5600px;}
    100%   {left: -0px;}
}

@-o-keyframes myfirst
{
    0%   {left: 0px;}
    4%   {left: 0px;}
    16%   {left: -800px;}
    28%   {left: -1600px;}
    40%   {left: -2400px;}
    52%   {left: -3200px;}
    64%   {left: -4000px;}
    76%   {left: -4800px;}
    88%   {left: -5600px;}
    100%   {left: -0px;}
}

@-moz-keyframes myfirst
{
    0%   {left: 0px;}
    4%   {left: 0px;}
    16%   {left: -800px;}
    28%   {left: -1600px;}
    40%   {left: -2400px;}
    52%   {left: -3200px;}
    64%   {left: -4000px;}
    76%   {left: -4800px;}
    88%   {left: -5600px;}
    100%   {left: -0px;}
}

@-webkit-keyframes myfirst
{
    0%   {left: 0px;}
    4%   {left: 0px;}
    16%   {left: -800px;}
    28%   {left: -1600px;}
    40%   {left: -2400px;}
    52%   {left: -3200px;}
    64%   {left: -4000px;}
    76%   {left: -4800px;}
    88%   {left: -5600px;}
    100%   {left: -0px;}
}

@keyframes myfirstArr
{
    0%   {left: 0px;}

    19%   {left: 0px;}
    20%   {left: 30px;}

    39%   {left: 30px;}
    40%   {left: 60px;}
    59%   {left: 60px;}
    60%   {left: 90px;}
    79%   {left: 90px;}
    80%   {left: 120px;}
    99%   {left: 120px;}
    100%   {left: 0px;}
}


@-webkit-keyframes myfirstArr
{
    0%   {left: 0px;}

    19%   {left: 0px;}
    20%   {left: 30px;}

    39%   {left: 30px;}
    40%   {left: 60px;}
    59%   {left: 60px;}
    60%   {left: 90px;}
    79%   {left: 90px;}
    80%   {left: 120px;}
    99%   {left: 120px;}
    100%   {left: 0px;}
}

@-moz-keyframes myfirstArr
{
    0%   {left: 0px;}

    19%   {left: 0px;}
    20%   {left: 30px;}

    39%   {left: 30px;}
    40%   {left: 60px;}
    59%   {left: 60px;}
    60%   {left: 90px;}
    79%   {left: 90px;}
    80%   {left: 120px;}
    99%   {left: 120px;}
    100%   {left: 0px;}
}

@-o-keyframes myfirstArr
{
    0%   {left: 0px;}

    19%   {left: 0px;}
    20%   {left: 30px;}

    39%   {left: 30px;}
    40%   {left: 60px;}
    59%   {left: 60px;}
    60%   {left: 90px;}
    79%   {left: 90px;}
    80%   {left: 120px;}
    99%   {left: 120px;}
    100%   {left: 0px;}
}